import React, { Component } from 'react'
import axios from 'axios'
import Tuijian from './components/tuijian';
import './index.css'
import Adv from './components/adv';
import MainHeader from './components/mainheader';
import withRightNav from '../../components/hoc/withRightNav';
import { CenterPopup } from 'antd-mobile'
class Main extends Component {
    constructor() {
        super();
        this.state = {
            tuijianArr: [],
            swiperArr: [],
            recommendList: [],
            daojishiObj: null,
            visible: true
        }

    }
    componentDidMount() {
        // const [visible, setVisible] = useState(true);
        axios.post("https://srv.hotkidceo.com/appapi/api/root-ceo-content/hpPageConfigure/pageList", { "channelId": null, "memberKey": "" }).then(
            (res) => {
                console.log(res.data.data[5]);
                this.setState({
                    swiperArr: res.data.data[1].configureAttribute,
                    list: res.data.data[2].configureAttribute,
                    // recommendList: res.data.data[10].configureAttributeList
                    daojishiObj: res.data.data[5]
                })
            }
        )
        axios.post("https://srv.hotkidceo.com/appapi/root-ceo-commodity/commodityApi/commodityByBigData", { "page": 1, "isWholeSale": 0, "channelId": "C06022632001", "memberKey": 33214168 }).then(
            (res) => {
                this.setState({
                    recommendList: res.data.data.templateList
                })
            }
        )
    }
    render() {
        let { swiperArr, recommendList, list, daojishiObj } = this.state;
        let { history } = this.props;
        return (
            <div>
                {swiperArr.length !== 0 ? <MainHeader swiperArr={swiperArr} list={list} history={history} /> : ""}
                {daojishiObj != null ? <Adv daojishiObj={daojishiObj} /> : ''}
                <Tuijian recommendList={recommendList} ></Tuijian>
                <CenterPopup
                    visible={this.state.visible}
                    onMaskClick={() => {
                        this.setState({
                            visible: false
                        })
                    }}
                >
                    <div className='frameImg'></div>
                    <div className='closeImg' onClick={() => {
                        this.setState({
                            visible: false
                        })
                    }}></div>
                </CenterPopup>
            </div>
        )
    }
}
export default withRightNav(Main);